import { rpxToPx, toDecimalPrecision } from '@/utils/share'
import type { HomeType } from '../../interface'

export const getOptions = (params: HomeType.CheckData) => {
    const data = [
        { value: params.qualified_cert_total, name: '合格发证人数' },
        { value: params.qualified_no_cert_total, name: '合格未发证人数' },
        { value: params.trial_not_qualified_total, name: '试讲不及格人数' },
        { value: params.written_not_qualified_total, name: '笔试不及格人数' },
        { value: params.trial_written_not_qualified_total, name: '试讲笔试均不及格人数' },
    ]

    const dataMap = new Map(data.map(({ value, name }) => [name, value]))

    const option: echarts.EChartsCoreOption = {
        tooltip: {
            //浮窗
            trigger: 'item',
            textStyle: {
                fontSize: rpxToPx(26),
            },
        },
        color: ['#27D9CE', '#5894FF', '#FE776E', '#FF953F', '#B76AFA'],
        graphic: {
            elements: [
                {
                    type: 'image',
                    style: {
                        image: 'https://test-oss.busionline.com/images/png_tubiao_yuan.png',
                        width: rpxToPx(188),
                        height: rpxToPx(188),
                    },
                    left: 'center',
                    top: rpxToPx(100),
                },
            ],
        },
        //标题
        series: [
            {
                type: 'pie',
                center: ['50%', '37%'],
                radius: ['40%', '60%'],
                avoidLabelOverlap: false,
                legendHoverLink: false,
                label: {
                    show: false,
                    position: 'center',
                    formatter: (item: Record<string, any>) => {
                        /** 换行显示 */
                        const wrapLine = (v: string, pos: number = 6) => {
                            const before = v.slice(0, pos)
                            const after = v.slice(pos, v.length)

                            return `${before}\n${after}`
                        }
                        return `{itemValue|${item.value}}\n{itemName|${wrapLine(item.name)}}`
                    },
                    align: 'center',
                    color: '#333',
                    verticalAlign: 'top',
                },
                emphasis: {
                    label: {
                        show: true,
                        rich: {
                            itemValue: {
                                fontSize: rpxToPx(36),
                                color: '#333',
                                lineHeight: rpxToPx(50),
                            },
                            itemName: {
                                fontSize: rpxToPx(26),
                                color: '#999',
                            },
                        },
                    },
                },
                labelLine: {
                    show: false,
                },
                data,
            },
        ],
        legend: {
            bottom: 0,
            left: 'center',
            itemWidth: rpxToPx(24),
            itemHeight: rpxToPx(24),
            itemGap: rpxToPx(26),
            fontSize: rpxToPx(26),
            formatter: function (name: string) {
                const total = data.reduce((acc, cur) => acc + cur.value, 0)
                const dataValue = dataMap.get(name)

                let ratio = 0

                if (dataValue) {
                    ratio = toDecimalPrecision((dataValue / total) * 100, 2)
                }

                return `${name}${ratio}%`
            },
        },
    }

    return option
}
